import React from 'react'
import { Select,Row, Col,Input,Button  } from 'antd';


export default class SearchInput extends React.Component{
    render(){
        function handleChange(value) {
            console.log(`selected ${value}`);
        }

        function onChange(value) {
        console.log(`selected ${value}`);
        }

        function onBlur() {
        console.log('blur');
        }

        function onFocus() {
        console.log('focus');
        }

        function onSearch(val) {
        console.log('search:', val);
        }
        return(
            <div>
                <Row gutter={[16, 24]}>
                    <Col className="gutter-row" span={6}>
                        服务类型&nbsp;
                        <Select defaultValue="lucy" style={{ width: 120 }} onChange={handleChange}>
                            <Option value="jack">Jack</Option>
                            <Option value="lucy">Lucy</Option>
                            <Option value="disabled" disabled>
                                Disabled
                            </Option>
                            <Option value="Yiminghe">yiminghe</Option>
                        </Select>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        服务城市&nbsp;
                         <Input style={{ width: 121 }} placeholder="Basic usage" />
                    </Col>
                    <Col className="gutter-row" span={6}>
                        服务区域&nbsp;
                        <Input style={{ width: 121 }} placeholder="Basic usage" />
                    </Col>
                    <Col className="gutter-row" span={6}>
                        服务机场&nbsp;
                        <Select defaultValue="lucy" style={{ width: 120 }} onChange={handleChange}>
                            <Option value="jack">Jack</Option>
                            <Option value="lucy">Lucy</Option>
                            <Option value="disabled" disabled>
                                Disabled
                            </Option>
                            <Option value="Yiminghe">yiminghe</Option>
                        </Select>
                    </Col>
                </Row>
                <Row>
                    <Col span={4} offset={20}>
                            <Button type="primary">搜索</Button>
                    </Col>
                </Row>
            </div>
        )
    }
}